import React from 'react'
import CartCss from './index.module.scss'
import { Switch, Route, Link } from "react-router-dom"
import CartDom from '../../pages/cartDom'
import CartOve from '../../pages/cartOve'

class Cart extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tabList: [
                {
                    "tabId": "0",
                    "title": "国内购",
                    "router": "/cart/cartDom"
                },
                {
                    "tabId": "1",
                    "title": "海淘",
                    "router": "/cart/cartOve"
                }
            ],
            routerPath:""
        }
    }
    render() {
        return (
            <div className={CartCss.main}>
                <div className={CartCss.header}>
                    <i className="iconfont icon-btn_backx"></i>
                    <ul className={CartCss.myTab}>
                        {
                            this.state.tabList.map((item, index) => {
                                return (
                                    <li onClick={this.tabChange.bind(this,item.router)} className={this.state.routerPath===item.router? CartCss.liChange:""} key={index}><Link to={item.router}>{item.title}</Link></li>
                                )
                            })
                        }

                    </ul>
                    <p>管理</p>
                </div>

                <div>
                    <Switch>
                        <Route path="/cart/cartDom" component={CartDom}></Route>
                        <Route path="/cart/cartOve" component={CartOve}></Route>
                    </Switch>
                </div>
            </div>
        )
    }
    tabChange=(e)=>{
        // console.log(this.props)
        this.setState({
            routerPath: e
        })
        // let routerPath = props.location.pathname
    }
    componentDidMount=()=>{
        this.setState({
            routerPath: this.props.location.pathname
        })
        // console.log(this.props.location.pathname)
    }
}
export default Cart